<template>
  <t-dialog header="审批" :visible.sync="visible" :onClose="closeDialog" :closeOnOverlayClick="false" confirmBtn="提交审批"
    @confirm="onSubmit" mode="full-screen" top="5%">
    <div style="height: 80vh">
      <innovation-detail :review-open="true" :reviewOpen="true" :approveType="row.approveType"
        :objId="row.innovations.id" :visible.sync="dialog.open_innovation_detail"></innovation-detail>
      <t-drawer :visible="drawerVisible" showInAttachedElement :showOverlay="false" size="27%"
        :preventScrollThrough="false" header="评审内容">
        <t-form ref="form" label-align="top" :data="formData" :disabled="!reviewOpen" :rules="rules">
          <t-form-item label="审批业务类型" name="approveType">
            <t-select disabled v-model="formData.approveType" clearable :options="dict.type.wcx_approve_type">
            </t-select>
          </t-form-item>
          <t-form-item v-if="formData.approveStatus === '3'" label="审批意见">
            <template slot="label">
              审批意见 <t-link v-if="reviewOpen" @click="dialog.open_approval_opinions_list = true" style="margin-left:10px"
                hover="color" theme="primary">选择常用审批意见</t-link>
            </template>
            <t-textarea :autosize="{ minRows: 5 }" v-model="formData.opinion" placeholder="请输入内容" />
          </t-form-item>
          <t-form-item v-else name="opinion" label="审批意见">
            <template slot="label">
              审批意见 <t-link v-if="reviewOpen" @click="dialog.open_approval_opinions_list = true" style="margin-left:10px"
                hover="color" theme="primary">选择常用审批意见</t-link>
            </template>
            <t-textarea :autosize="{ minRows: 5 }" v-model="formData.opinion" placeholder="请输入内容" />
          </t-form-item>

          <t-form-item label="审批结果" name="approveStatus">
            <t-radio-group v-model="formData.approveStatus">
              <t-radio value="3" label="通过"></t-radio>
              <t-radio value="4" label="退回"></t-radio>
            </t-radio-group>
          </t-form-item>
          <p style="color:red; font-size: 12px" v-if="isAttributeDept">
            {{ formData.approveStatus === '3' ? '注意：归口管理单位审批通过后，如果需要推荐，请前往推荐管理-->我的推荐菜单中操作。' :
              '注意：如果不通过，申报单位可以在审批截止时间之前继续修改，并再次提交。'
            }}

          </p>
        </t-form>
        <template #footer>
          <t-button theme="default" @click="closeDrawer">关闭评审界面</t-button>
          <t-button v-if="reviewOpen" theme="primary" @click="onSubmit(1)">暂存</t-button>
          <t-button v-if="reviewOpen" theme="primary" @click="onSubmit(2)">提交审批</t-button>
        </template>
      </t-drawer>
      <t-drawer :visible.sync="drawerApproveVisible" showInAttachedElement :showOverlay="false" size="80%"
        :preventScrollThrough="false" header="审批记录">
        <approve-list v-if="drawerApproveVisible" :isDialog="false" :objId="row.innovations.id"></approve-list>
        <template #footer>
          <t-button theme="default" @click="drawerApproveVisible = false">关闭审批记录</t-button>
        </template>
      </t-drawer>
    </div>
    <template #footer>
      <t-button theme="default" @click="closeDialog">取消</t-button>
      <t-button theme="default" variant="outline" @click="drawerApproveVisible = true">审批记录</t-button>
      <t-button theme="primary" @click="drawerVisible = true">打开评审界面</t-button>
    </template>
    <approval-opinions-list-dialog v-if="dialog.open_approval_opinions_list"
      :visible.sync="dialog.open_approval_opinions_list"
      @selectContent="formData.opinion = $event"></approval-opinions-list-dialog>

  </t-dialog>
</template>

<script>
import InnovationDetail from "../../innovation/components/innovation-detail.vue";
import approveList from "./approve-list.vue";
import ApprovalOpinionsListDialog from "@/pages/components/approval-opinions-list-dialog.vue"

export default {
  name: "approve-info",
  components: {
    InnovationDetail,
    approveList,
    ApprovalOpinionsListDialog
  },
  props: {
    row: Object,
    reviewOpen: {
      type: Boolean,
      default: true
    }
  },
  dicts: ['approve_status', 'wcx_approve_type'],
  data () {
    return {
      drawerVisible: false,
      drawerApproveVisible: false,
      isAttributeDept: false,
      dialog: {
        open_innovation_detail: false,
        open_outline_detail: false,
        open_contract_detail: false,
        open_approval_opinions_list: false,
        objId: 0
      },
      formData: {
        id: null,
        businessId: null,
        approveType: null,
        opinion: '',
        approveStatus: "3",
        zan: '0',
      },
      rules: {
        opinion: [
          { required: true, message: "审批意见不能为空" }
        ],
        approveStatus: [
          { required: true, message: "审批结果不能为空" }
        ],
      },
      visible: true,
      loading: false,
      value: "first",
      dataLoading: false,
    }
  },
  created () {
    this.row.approveStatus = this.row.approveStatus || '3';
    Object.assign(this.formData, this.row);
    this.getIsAttributeDept()
  },
  methods: {
    getIsAttributeDept () {
      this.$api.system.dept.isAttributeDept().then(response => {
        this.isAttributeDept = response.data;
      }).catch(e => {
        this.$message.error(e.toString())
      })
    },
    closeDrawer () {
      this.drawerVisible = false
    },
    closeDialog () {
      this.$emit("update:visible", false);
    },
    onSubmit (type) {
      if (type === 1) {
        this.formData.zan = '1';
        this.$api.wcx.approve.opApprove(this.formData).then(response => {
          this.$message.success('暂存成功');
          this.$emit("reload");
          this.$emit("update:visible", false);
        }).catch((e) => {
          this.$message.error(e.toString());
        });
      } else {
        this.formData.zan = '0';
        this.$refs.form.validate().then((validateResult) => {
          if (validateResult === true) {
            const confirmDia = this.$dialog.confirm({
              header: "审批提示",
              body: `是否确认提交？`,
              theme: "warning",
              onConfirm: ({ e }) => {
                if (this.formData.approveStatus === "3" && !this.formData.opinion) {
                  this.formData.opinion = "通过"
                }
                confirmDia.update({
                  confirmBtn: {
                    loading: true,
                  },
                })
                this.$api.wcx.approve.opApprove(this.formData).then(response => {
                  this.$message.success('提交成功');
                  this.$emit("reload");
                  this.$emit("update:visible", false);
                  confirmDia.destroy();
                }).catch((e) => {
                  confirmDia.update({
                    confirmBtn: {
                      loading: false,
                    },
                  })
                  this.$message.error(e.toString());
                });
              },
            })
          } else {
            const firstError = Object.values(validateResult)[0]?.[0]?.message;
            this.$message.error(firstError);
          }
        })
      }
    },
  }
}
</script>

<style lang="less" scoped>
.t-tab-panel {
  padding: 10px;
}

.t-form__item {
  margin-bottom: 6px
}

.t-row {
  margin-bottom: 14px;
}

.step-card {
  height: 100%;
  margin-bottom: 14px;
}

/deep/ .t-drawer .t-drawer__content-wrapper {
  height: calc(100% - var(--td-comp-size-xxxl));
  margin-top: var(--td-comp-size-xxxl);
}

/deep/ .t-drawer__header {
  display: none;
}
</style>
